<!DOCTYPE html>
<html xmlns:v-on="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="utf-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
    <title>乐优商城--购物车页面</title>

    <link rel="stylesheet" type="text/css" href="css/webbase.css"/>
    <link rel="stylesheet" type="text/css" href="css/pages-cart.css"/>
</head>

<body>

<div id="cartApp">

    <div class="top">
        <shortcut/>
    </div>

    <div class="cart py-container">

        <!--logoArea-->
        <div class="logoArea">
            <div class="fl logo"><span class="title">购物车</span></div>
        </div>

        <!--All goods-->
        <div class="allgoods">
            <h4>全部商品<span>{{carts.length}}</span></h4>
            <div class="cart-main">
                <div class="yui3-g cart-th">
                    <!--$event代表当前全选框对象-->
                    <div class="yui3-u-1-4"><input type="checkbox" v-model="selectAll" @click="checkAll($event)"/> 全部
                    </div>
                    <div class="yui3-u-1-4">商品</div>
                    <div class="yui3-u-1-8">单价（元）</div>
                    <div class="yui3-u-1-8">数量</div>
                    <div class="yui3-u-1-8">小计（元）</div>
                    <div class="yui3-u-1-8">操作</div>
                </div>
                <div class="cart-item-list">

                    <div class="cart-body">
                        <div class="cart-list">
                            <ul class="goods-list yui3-g" v-for="(cart,i) in carts" :key="i">
                                <li class="yui3-u-1-24">
                                    <input type="checkbox" v-model="selected" :value="cart"/>
                                </li>
                                <li class="yui3-u-11-24">
                                    <div class="good-item">
                                        <div class="item-img"><img :src="cart.image" width="80px" height="80px"/></div>
                                        <div class="item-msg">
												<span style="line-height:70px ">
													{{cart.title}}
												</span>
                                            <br/>
                                            <!--将私有属性解析出来 需要解析两次-->
                                            <span v-for="(v,k) in JSON.parse(JSON.parse(cart.ownSpec))" :key="k">
                                                          {{v}}
                                                </span>
                                        </div>
                                    </div>
                                </li>

                                <li class="yui3-u-1-8">
                                    <span style="line-height:70px" class="price">
                                        <!--通过判断新的商品价格是否变化，来添加删除线-->
                                        <span v-if="cart.price!=cart.newPrice">
                                             <s>{{ly.formatPrice(cart.price)}}</s>
                                        </span>
                                        <span v-else>
                                            {{ly.formatPrice(cart.price)}}
                                        </span>
                                    </span>
                                    <div v-show="cart.price!=cart.newPrice">
                                        <!--通过判断价格的变化，来决定显示“涨价”或“降价”-->
                                        <span>商品已<span v-text="cart.price>cart.newPrice?'降价':'涨价'"></span>,现价为：</span>
                                        <span style="color: red">{{ly.formatPrice(cart.newPrice)}}</span>
                                    </div>
                                </li>
                                <li class="yui3-u-1-8" style="padding-top: 20px">
                                    <a href="javascript:void(0)" class="increment mins" @click="decrement(cart)">-</a>
                                    <input id="change" autocomplete="off" type="text" value="1" minnum="1" class="itxt"
                                           v-on:input="change(cart)" v-model="cart.num"/>
                                    <a href="javascript:void(0)" class="increment plus" @click="increment(cart)">+</a>
                                </li>
                                <!--根据最新的价格进行小计-->
                                <li class="yui3-u-1-8"><span style="line-height:70px " class="sum">{{ly.formatPrice(cart.num * cart.newPrice)}}</span>
                                </li>
                                <li class="yui3-u-1-8">
                                    <a href="#none" @click="delCart(cart)">删除</a><br/>
                                    <a href="#none" @click="mycollection(cart,i)">移到我的关注</a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>

            </div>
            <div class="cart-tool">
                <div class="select-all">
                    <input type="checkbox" name="" id="" value="" v-model="selectAll" @click="checkAll($event)"/>
                    <span>全选</span>
                </div>
                <div class="option">
                    <a href="#none" @click="delChoose">删除选中的商品</a>
                    <a href="#none" @click="moveAll">移到我的关注</a>
                    <!--<a href="#none">清除下柜商品</a>-->
                </div>
                <div class="toolbar">
                    <div class="chosed">已选择<span>{{selected.length}}</span>件商品</div>
                    <div class="sumprice">
                        <span><em>总价（不含运费） ：</em><i class="summoney">{{ly.formatPrice(totalPrice)}}</i></span>
                        <!--<span><em>已节省：</em><i>-¥20.00</i></span>-->
                    </div>
                    <div class="sumbtn">
                        <a class="sum-btn" href="getOrderInfo.html" @click.prevent="toOrderInfo" target="_blank">结算</a>
                    </div>
                </div>
            </div>
            <div class="clearfix"></div>
            <!--v-show的值要增加健壮性判断，delCarts可能为null，会报异常-->
            <div class="deled"  v-if=" this.delCarts != null ">
                <div class="cart-list del" v-show=" this.delCarts.length > 0 || false ">
                    <span>已删除商品，您可以重新购买或加关注：</span>
                    <a href="#none" style="color: red" @click="clearAll">清空已删除</a>
                    <ul class="goods-list yui3-g" v-for="(c,i) in delCarts" :key="i">
                        <li class="yui3-u-1-2">
                            <div class="good-item">
                                <div class="item-msg">{{c.title}}
                                    <!--Apple Macbook Air 13.3英寸笔记本电脑 银色（Corei5）处理器/8GB内存--></div>
                            </div>
                        </li>
                        <li class="yui3-u-1-6"><span class="price">{{ly.formatPrice(c.newPrice)}}</span></li>
                        <li class="yui3-u-1-6">
                            <span class="number">{{c.num}}</span>
                        </li>
                        <li class="yui3-u-1-8">
                            <a href="#none" @click="buyagain(c,i)">重新购买</a>
                            <a href="#none" @click="mycollectiondel(c,i)">移到我的关注</a>
                        </li>
                    </ul>
                </div>
            </div>

            <div class="deled" v-if="this.oldCarts!=null">
                <div class="cart-list del" v-show=" this.oldCarts.length > 0 ">
                    <span>已下柜商品，您可以选择删除：</span>
                    <ul class="goods-list yui3-g" v-for="(oc,i) in oldCarts" :key="i">
                        <li class="yui3-u-1-2">
                            <div class="good-item">
                                <div class="item-msg">{{oc.title}}
                                    <!--Apple Macbook Air 13.3英寸笔记本电脑 银色（Corei5）处理器/8GB内存--></div>
                            </div>
                        </li>
                        <li class="yui3-u-1-6"><span class="price">{{ly.formatPrice(oc.newPrice)}}</span></li>
                        <li class="yui3-u-1-6">
                            <span class="number">{{oc.num}}</span>
                        </li>
                        <li class="yui3-u-1-8">
                            <a href="#none" @click="delOld(oc)">删除</a>
                        </li>
                    </ul>
                </div>
            </div>

            <div class="liked">
                <ul class="sui-nav nav-tabs">
                    <li class="active">
                        <a href="#index" data-toggle="tab">猜你喜欢</a>
                    </li>
                    <li>
                        <a href="#profile" data-toggle="tab">特惠换购</a>
                    </li>
                </ul>
                <div class="clearfix"></div>
                <div class="tab-content">
                    <div id="index" class="tab-pane active">
                        <div id="myCarousel" data-ride="carousel" data-interval="4000" class="sui-carousel slide">
                            <div class="carousel-inner">
                                <div class="active item">
                                    <ul>
                                        <li>
                                            <img src="img/like1.png"/>
                                            <div class="intro">
                                                <i>Apple苹果iPhone 6s (A1699)</i>
                                            </div>
                                            <div class="money">
                                                <span>$29.00</span>
                                            </div>
                                            <div class="incar">
                                                <a href="#" class="sui-btn btn-bordered btn-xlarge btn-default"><i
                                                        class="car"></i><span class="cartxt">加入购物车</span></a>
                                            </div>
                                        </li>
                                        <li>
                                            <img src="img/like2.png"/>
                                            <div class="intro">
                                                <i>Apple苹果iPhone 6s (A1699)</i>
                                            </div>
                                            <div class="money">
                                                <span>$29.00</span>
                                            </div>
                                            <div class="incar">
                                                <a href="#" class="sui-btn btn-bordered btn-xlarge btn-default"><i
                                                        class="car"></i><span class="cartxt">加入购物车</span></a>
                                            </div>
                                        </li>
                                        <li>
                                            <img src="img/like3.png"/>
                                            <div class="intro">
                                                <i>Apple苹果iPhone 6s (A1699)</i>
                                            </div>
                                            <div class="money">
                                                <span>$29.00</span>
                                            </div>
                                            <div class="incar">
                                                <a href="#" class="sui-btn btn-bordered btn-xlarge btn-default"><i
                                                        class="car"></i><span class="cartxt">加入购物车</span></a>
                                            </div>
                                        </li>
                                        <li>
                                            <img src="img/like4.png"/>
                                            <div class="intro">
                                                <i>Apple苹果iPhone 6s (A1699)</i>
                                            </div>
                                            <div class="money">
                                                <span>$29.00</span>
                                            </div>
                                            <div class="incar">
                                                <a href="#" class="sui-btn btn-bordered btn-xlarge btn-default"><i
                                                        class="car"></i><span class="cartxt">加入购物车</span></a>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                                <div class="item">
                                    <ul>
                                        <li>
                                            <img src="img/like1.png"/>
                                            <div class="intro">
                                                <i>Apple苹果iPhone 6s (A1699)</i>
                                            </div>
                                            <div class="money">
                                                <span>$29.00</span>
                                            </div>
                                            <div class="incar">
                                                <a href="#" class="sui-btn btn-bordered btn-xlarge btn-default"><i
                                                        class="car"></i><span class="cartxt">加入购物车</span></a>
                                            </div>
                                        </li>
                                        <li>
                                            <img src="img/like2.png"/>
                                            <div class="intro">
                                                <i>Apple苹果iPhone 6s (A1699)</i>
                                            </div>
                                            <div class="money">
                                                <span>$29.00</span>
                                            </div>
                                            <div class="incar">
                                                <a href="#" class="sui-btn btn-bordered btn-xlarge btn-default"><i
                                                        class="car"></i><span class="cartxt">加入购物车</span></a>
                                            </div>
                                        </li>
                                        <li>
                                            <img src="img/like3.png"/>
                                            <div class="intro">
                                                <i>Apple苹果iPhone 6s (A1699)</i>
                                            </div>
                                            <div class="money">
                                                <span>$29.00</span>
                                            </div>
                                            <div class="incar">
                                                <a href="#" class="sui-btn btn-bordered btn-xlarge btn-default"><i
                                                        class="car"></i><span class="cartxt">加入购物车</span></a>
                                            </div>
                                        </li>
                                        <li>
                                            <img src="img/like4.png"/>
                                            <div class="intro">
                                                <i>Apple苹果iPhone 6s (A1699)</i>
                                            </div>
                                            <div class="money">
                                                <span>$29.00</span>
                                            </div>
                                            <div class="incar">
                                                <a href="#" class="sui-btn btn-bordered btn-xlarge btn-default"><i
                                                        class="car"></i><span class="cartxt">加入购物车</span></a>
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <a href="#myCarousel" data-slide="prev" class="carousel-control left">‹</a>
                            <a href="#myCarousel" data-slide="next" class="carousel-control right">›</a>
                        </div>
                    </div>
                    <div id="profile" class="tab-pane">
                        <p>特惠选购</p>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>
<script src="./js/vue/vue.js"></script>
<script src="./js/axios.min.js"></script>
<script src="./js/common.js"></script>
<script type="text/javascript">
    var cartVm = new Vue({
        el: "#cartApp",
        data: {
            ly,
            carts: [], //购物车中的数据
            selected: [],//被选中的商品
            selectAll: false,//是否被全选
            delCarts: [],//被删除的商品
            oldCarts: [], //下架的商品
        },
        computed: {
            //计算属性，计算商品的总价格
            totalPrice() {
                return this.selected.map(c => c.num * c.newPrice).reduce((p1, p2) => p1 + p2, 0);
            }
        },
        //钩子函数，页面加载时就执行
        created() {
            //先进行健壮性判断
            if (ly.store.get("delCarts") != null) {
                this.delCarts = ly.store.get("delCarts");
            }
            if (ly.store.get("oldCarts") != null) {
                this.oldCarts = ly.store.get("oldCarts");
            }

            //页面加载，判断用户是否登录，然后把本地的数据发送给后台进行存储，即合并购物车
            ly.verifyUser()
                .then(() => {
                    //将本次存储的数据查询出来后，转成json数据传到后台
                    const tempCarts = ly.store.get("carts").map(tc => ly.parse(tc));

                    //不允许循环发请求，虽然实现效果一样，但会多次请求会产生很多垃圾数据
                    // tempCarts.forEach(tc => {
                    //     ly.http.post("/cart",ly.parse(tc))
                    // });

                    ly.http.post("/cart", tempCarts);
                    ly.store.del("carts");
                    //window.location.reload(true);
                });

            //页面加载的时候就把购物车中的数据展示出来
            this.loadCarts();
        },
        //每次操作商品种类数量时，都要更新商品种类数量到本地存储，便于top.js中角标数量的取值，
        //即：ly.store.set("cartslength",this.carts.length)
        methods: {
            //加载商品信息
            loadCarts() {
                //先判断登录状态
                ly.verifyUser()
                    .then(() => {
                        //用户登录状态，从redis中查询购物车信息
                        ly.http.get("/cart")
                            .then((resp) => {
                                this.carts = resp.data;
                                //下面是查询新的价格，以便比对价格变化
                                const skuTitles = resp.data.map(sku => sku.title);
                                ly.http.post("item/sku/newList", skuTitles)
                                    .then(({data}) => {
                                        this.carts.forEach(cart => {
                                            data.forEach(newCart => {
                                                if (cart.title === newCart.title) {
                                                    //通过Vue的set方法，可以给对象动态新增属性
                                                    Vue.set(cart, 'newPrice', newCart.price);
                                                }
                                            })
                                        })
                                    });
                                //下面是查询商品上下架状态，单独列出
                                ly.http.post("item/spu/oldSpu", skuTitles)
                                    .then(({data}) => {
                                        for (let i = 0; i < this.carts.length; i++) {
                                            for (let j = 0; j < data.length; j++) {

                                                if (data[j][this.carts[i].title] === false) {
                                                    //当对应spu为下架状态时，将该商品单独列出来显示
                                                    this.oldCarts.push(this.carts[i]);
                                                    this.carts.splice(i, 1);
                                                }
                                            }
                                        }
                                    });

                                this.selectAll = true;
                                this.selected = this.carts;
                                ly.store.set("cartslength", this.carts.length)
                            });
                    })
                    .catch(() => {
                        //用户未登录状态，从localstorage中查询购物车信息
                        this.carts = ly.store.get("carts") || [];

                        //下面是查询新的价格，以便比对价格变化
                        const skuTitles = this.carts.map(sku => sku.title);
                        ly.http.post("item/sku/newList", skuTitles)
                            .then(({data}) => {
                                this.carts.forEach(cart => {
                                    data.forEach(newCart => {
                                        if (cart.title === newCart.title) {
                                            //通过Vue的set方法，可以给对象动态新增属性
                                            Vue.set(cart, 'newPrice', newCart.price);
                                        }
                                    })
                                })
                            });

                        //下面是查询商品上下架状态，单独列出
                        ly.http.post("item/spu/oldSpu", skuTitles)
                            .then(({data}) => {
                                for (let i = 0; i < this.carts.length; i++) {
                                    for (let j = 0; j < data.length; j++) {
                                        if (data[j][this.carts[i].title] === false) {
                                            //当对应spu为下架状态时，将该商品单独列出来显示
                                            this.oldCarts.push(this.carts[i]);
                                            this.carts.splice(i, 1);
                                        }
                                    }
                                }
                                //操作完毕后，将下架产品存到
                                ly.store.set("oldCarts", this.oldCarts);
                                //更新carts信息
                                ly.store.set("carts", this.carts);

                            });
                        this.selected = this.carts;
                        ly.store.set("cartslength", this.carts.length)
                    })
            },
            //递增商品数量
            increment(cart) {
                cart.num++;
                ly.verifyUser()
                    .then(() => {
                        //已经登录，发送请求，操作后台数据
                        ly.http.put("/cart/", ly.stringify({skuId: cart.skuId, num: cart.num}));
                    })
                    .catch(() => {
                        //未登录，直接操作本地数据
                        ly.store.set("carts", this.carts);
                    })
            },
            //递减商品数量
            decrement(cart) {
                if (cart.num <= 1) {
                    return;
                }
                cart.num--;
                ly.verifyUser()
                    .then(() => {
                        //已经登录，发送请求，操作后台数据
                        ly.http.put("/cart/", ly.stringify({skuId: cart.skuId, num: cart.num}))
                    })
                    .catch(() => {
                        //未登录，直接操作本地数据
                        ly.store.set("carts", this.carts);
                    })
            },
            //输入框中的值动态赋值给当前修改商品的num
            change(cart) {
                cart.num = parseInt($("#change").val()); //将input输入框中用户输入的数据赋值给当前商品的num

                ly.store.set("carts", this.carts);
            },
            //删除商品
            delCart(cart) {
                ly.verifyUser()
                    .then(() => {
                        // 已登录
                        ly.http.delete("/cart/" + cart.skuId)
                            .then(() => {
                                //定义一个carts的索引,来存储与当前cart相同的索引
                                let cartIndex = -1;
                                for (let i = 0; i < this.carts.length; i++) {
                                    if (cart.skuId === this.carts[i].skuId) {
                                        cartIndex = i;
                                        break;
                                    }
                                }
                                //从carts中删除当前cart
                                this.carts.splice(cartIndex, 1);
                                ly.store.set("cartslength", this.carts.length)
                            })
                    })
                    .catch(() => {
                        // 未登录 , splice 方法是从指定索引i处开始删除，第二个参数是删除的个数

                        //删除的时候，要从两个数组里删除数据，一个是carts，一个是selected，
                        //否则只从carts中删除的话，总价不能及时刷新

                        /*//定义一个selected的索引,来存储与当前select相同的索引
                        let selectIndex = -1;
                        for (let i = 0; i < this.selected.length; i++) {
                            if (cart.skuId === this.selected[i].skuId) {
                                selectIndex = i;
                                break;
                            }
                        }
                        //从selected中删除当前select
                        this.selected.splice(selectIndex, 1);*/

                        //定义一个carts的索引,来存储与当前cart相同的索引
                        let cartIndex = -1;
                        for (let i = 0; i < this.carts.length; i++) {
                            if (cart.skuId === this.carts[i].skuId) {
                                cartIndex = i;
                                break;
                            }
                        }
                        //从carts中删除当前cart
                        this.carts.splice(cartIndex, 1);
                        //将新的carts存入localstorage
                        ly.store.set("carts", this.carts);
                        ly.store.set("cartslength", this.carts.length)
                    });


                //将每次删除的商品加入到本地存储中
                const delCarts = ly.store.get("delCarts") || [];
                delCarts.push(cart);
                this.delCarts = delCarts;
                ly.store.set("delCarts", delCarts);
                //window.location.reload(true);
            },

            // 勾选全选按钮时，实现全选或者全不选商品
            checkAll(e) {
                // e 是代表“全选按钮”的对象
                if (e.target.checked) {
                    this.selected = this.carts;
                } else {
                    this.selected = [];
                }
            },

            //重新购买
            buyagain(cart, i) {
                this.delCarts.splice(i, 1);//从已删除商品集合中删除
                ly.store.set("delCarts", this.delCarts);//更新delCarts
                ly.verifyUser()
                    .then(() => {
                        //用户登录
                        //要将数据转成json格式传给后台
                        ly.http.post("/cart", new Array(ly.parse(cart)));
                        this.loadCarts();
                    })
                    .catch(() => {
                        //用户未登录
                        this.carts.push(cart);//将该商品重新加入carts中
                        //更新carts
                        ly.store.set("carts", this.carts);
                    })


            },

            //清空已删除
            clearAll() {
                this.delCarts = [];
                ly.store.set("delCarts", this.delCarts);
            },

            //批量删除
            delChoose() {
                const delChoose = this.selected;
                delChoose.forEach(d => {
                    this.delCart(d);
                });
                //更新selected和delCarts
                this.selected = [];
                ly.store.set("delCarts", this.delCarts);
            },

            //跳转到结算页方法
            toOrderInfo() {
                //先判断用户是否登录
                ly.verifyUser()
                    .then(() => {
                        //若用户登录了,将购物车中选中的商品存到localstorage中，以便结算页取值
                        ly.store.set("selectedCarts", this.selected);
                        //将结算的物品从购物车删除
                        this.selected.forEach((cart,index)=>{
                           this.delCart(cart);
                        });

                        ly.store.del("delCarts");
                        // 跳转到结算界面,这里设定延时跳转，否则直接跳转的话，跳转之前的方法来不及不生效
                        setTimeout("javascript:location.href='/getOrderInfo.html'", 2000);
                        //window.location.href = "/getOrderInfo.html";
                    })
                    .catch(() => {
                        //若用户未登录，则跳转到登录页面，再通过returnUrl回跳到登录前的页面
                        window.location.href = "/login.html?returnUrl=" + window.location.href;
                    })
            },

            //删除下架的商品
            delOld(oc) {
                ly.verifyUser()
                    .then(() => {
                        // 已登录
                        ly.http.delete("/cart/" + oc.skuId)
                            .then(() => {
                                //定义一个carts的索引,来存储与当前cart相同的索引
                                let cartIndex = -1;
                                for (let i = 0; i < this.oldCarts.length; i++) {
                                    if (oc.skuId === this.oldCarts[i].skuId) {
                                        cartIndex = i;
                                        break;
                                    }
                                }
                                //从oldCarts中删除当前下架的cart
                                this.oldCarts.splice(cartIndex, 1);
                                ly.store.set("cartslength", this.carts.length)
                            })
                    })
                    .catch(() => {
                        // 未登录 , splice 方法是从指定索引i处开始删除，第二个参数是删除的个数

                        //定义一个carts的索引,来存储与当前cart相同的索引
                        let cartIndex = -1;
                        for (let i = 0; i < this.oldCarts.length; i++) {
                            if (oc.skuId === this.oldCarts[i].skuId) {
                                cartIndex = i;
                                break;
                            }
                        }
                        //从oldCarts中删除当前cart
                        this.oldCarts.splice(cartIndex, 1);
                        //更新oldCarts的本地存储
                        ly.store.set("oldCarts", this.oldCarts);
                        ly.store.set("cartslength", this.carts.length)
                    });
            },

            //移动所选中的所有商品到我的收藏
            moveAll() {
                const selected = this.selected;
                selected.forEach((cart,i) => {
                    this.mycollection(cart,i);
                    this.selected = [];
                })

            },

            //移动商品到我的收藏
            mycollection(cart, index) {
                ly.verifyUser()
                    .then(() => {
                        ly.http.post("/cart/collect", cart)
                            .then(() => {
                                //操作成功后，删除carts数组中的该数据
                                this.carts.splice(index, 1);
                                this.delCarts.splice(index,1);
                            })
                    })
                    .catch(() => {
                        alert("登录失效了，请重新登录！")
                        window.location = "/login.html?returnUrl=" + window.location;
                    })
            },

            //移动已删除商品到我的收藏
            mycollectiondel(cart, index) {
                ly.verifyUser()
                    .then(() => {
                        ly.http.post("/cart/collect", cart)
                            .then(() => {
                                //操作成功后，删除delcarts数组中的该数据
                                this.delCarts.splice(index,1);
                                ly.store.set("delCarts",this.delCarts);
                            })
                    })
                    .catch(() => {
                        alert("登录失效了，请重新登录！")
                        window.location = "/login.html?returnUrl=" + window.location;
                    })
            }
        },
        //使用watch函数来实现 当商品全部被手动选择后，全选按钮的勾选实现
        watch: {
            selected: {
                deep: true,
                handler() {
                    if (this.carts.length == this.selected.length) {
                        this.selectAll = true;
                    } else {
                        this.selectAll = false;
                    }
                }
            },
            // selectAll:{
            //     deep:true,
            //     handler(){
            //         if (this.selectAll) {
            //             this.selected = this.carts;
            //         } else {
            //             this.selected = [];
            //         }
            //     }
            // }
        },

        components: {
            shortcut: () => import("/js/pages/shortcut.js")
        }

    });
</script>
<!-- 底部栏位 -->
<!--页面底部，由js动态加载-->
<script type="text/javascript" src="js/plugins/jquery/jquery.min.js"></script>
<div class="clearfix footer"></div>
<script type="text/javascript">$(".footer").load("foot.html");</script>
<!--页面底部END-->
<script type="text/javascript" src="js/plugins/jquery.easing/jquery.easing.min.js"></script>
<script type="text/javascript" src="js/plugins/sui/sui.min.js"></script>
<script type="text/javascript" src="js/widget/nav.js"></script>

</body>

</html>